<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
	<title>JumpMail Email Template - Preview</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
	<script type="text/javascript">
		function set_frame_height(){
			var head_h = $('#header').outerHeight();
			$('#frame').height($(window).height() - head_h);
		}
		function change_template(src){
			var start_x = 50;
			var end_x = 180;
			$('#loading').show().stop(true, true).animate({'left' : end_x}, function(){
				$('#frame').attr('src', src);
			});
			$('#frame').load(function(){
				$('#loading').animate({ 'left' : start_x });
			});
		}
		
		$(document).ready(function(){
			set_frame_height();
			$(window).resize(function(){ set_frame_height(); });
			
			$('.colors ol li a').click(function(){
				$(this).parent().parent().find('a').removeClass('active');
				$(this).addClass('active');
				
				change_template($(this).attr('href'));
				return false;
			});
			$('a.color').click(function(){
				var last_ol = $('.colors > ul > li.active ol');
				$('.colors > ul > li').removeClass('active');
				$(this).parent().addClass('active');
				$(this).parent().find('ol').slideDown();
				last_ol.slideUp();
				$(this).parent().find('ol a').removeClass('active');
				$(this).parent().find('ol a').eq(0).addClass('active');
				change_template($(this).attr('href'));
				return false;
			});
			$('a.color:eq(0)').trigger('click');
		});
	</script>
	<style type="text/css" media="screen">
		* { padding:0; margin:0; outline:0; }
		html { overflow:hidden; }
		body { overflow:hidden; font-family: "Trebuchet MS", sans-serif; background:#fff; font-size:12px; line-height:14px; color:#754a27; }
		.cl { font-size:0; line-height:0; height:0; display:block; clear:both; }
		a { cursor:pointer;}
		#customize { width:168px; background:#fef9ec; border:solid 1px #d7bb9d; position:absolute; top:10px; left:10px; z-index:10; padding:6px 6px 10px 6px; text-align: center; }
		#customize { -moz-box-shadow:0 0 10px #999; -moz-border-radius:5px;}
		#customize { -webkit-box-shadow:0 0 10px #999; -webkit-border-radius:5px; box-shadow:0 0 10px #999}
		#frame { position:relative; z-index:1;}
		h2 { font-size:18px; line-height:18px; }
		h3 { font-weight: normal; font-size:13px; border-top:solid 1px #d7bb9d; border-bottom:solid 1px #d7bb9d; padding:8px 0; margin-top:5px; text-transform: capitalize; margin-bottom:1px;}
		.colors { border-bottom:solid 1px #d7bb9d; padding-bottom:1px; }
		.colors ul{ list-style-type: none; text-align: left; border-top:solid 1px #e9d7be;  }
		.colors ul li { }
		.colors ul li ol{ padding:5px 0 5px 30px; display:none; border-bottom:solid 1px #e9d7be;}
		.colors ul li ol li{ padding:0 0 3px 0; text-transform: capitalize;}
		.colors ul li ol li a{ color:#754a27; text-decoration: none; display:block;}
		.colors ul li ol li a:hover{ color:#d3b596;}
		.colors ul li ol li a.active{ font-weight: bold; color:#333;}
		.colors a.color { text-decoration: none; color:#754a27; display:block; height:21px; border-bottom:solid 1px #e9d7be; padding:4px 0 0 6px;  }
		.colors a.color:hover { color:#d3b596; }
		.colors a.color strong{ float:left; white-space:nowrap; line-height:18px; font-size:13px; padding-left:7px; text-transform: capitalize;}
		.colors a.color span{ float:left; width:13px; height:13px; border:solid 1px #e1d4c2; font-size:0; line-height:0; padding:1px; }
		.colors a.color span{ -moz-box-shadow:0 0 5px #c5b099; -webkit-box-shadow:0 0 5px #c5b099; box-shadow:0 0 5px #c5b099; }
		.colors a.color span em{ display:block; width:13px; height:13px; }
		.colors a.color span em b{ display:block; width:13px; height:13px; }
		.colors a.color span em b{ background:-moz-linear-gradient(#fff, #000); opacity: 0.5; -moz-opacity: 0.5; filter:alpha(opacity=50);}
		.colors a.color span em b{ background:-webkit-gradient(linear, left bottom, left top, color-stop(1, #fff), color-stop(0, #000)); }
		.colors a.color span,
		.colors a.color span em,
		.colors a.color span em b{ -moz-border-radius:3px; -webkit-border-radius:3px }
		.colors a.color:hover span { border-color:#b8926f;}
		.colors .active a.color { color:#333; background:-moz-linear-gradient(#fbf4e6, #f1e4cb); }
		.colors a.color:hover,
		.colors .active a.color { background:-moz-linear-gradient(#fbf4e6, #f1e4cb); }
		.colors a.color:hover,
		.colors .active a.color { background:#f8f0df; background:-webkit-gradient(linear, left bottom, left top, color-stop(1, #fbf4e6), color-stop(0, #f1e4cb)); }
		.colors .active a.color span{ -moz-box-shadow:0 0 5px #492d13; -webkit-box-shadow:0 0 5px #492d13; box-shadow:0 0 5px #492d13; }
		.colors .active a.color span{ border-color:#754a27;}
		.colors .active a.color em b{ opacity: 0.1; -moz-opacity: 0.1; filter:alpha(opacity=10); }
		#loading { position:absolute; top:21px; left:50px; z-index:3; display:none;}
		#loading span{ width:90px; text-align: center; padding:8px 0 8px 22px; background:#fef9ec; border:solid 1px #edddc8; display:block; position:relative;}
		#loading span{ -moz-border-radius:5px;}
		#loading span{ -webkit-border-radius:5px;}
		.mc-logos { font-size:0; line-height:0; padding:9px 0 0 0;}
		.logo { font-size:0; line-height:0;}
	</style>
</head>
<body>
<div id="loading"><span>Loading...</span></div>
<div id="customize">
	<div class="logo">
		<img src="logo.gif" alt="" />
	</div>
	<h3>Select color &amp; layout:</h3>
	<div class="colors">
		<div class="cl">&nbsp;</div>
		<ul>
			<li>
				<a href="default/layout1.html" class="color" style="color: #f2220c "><span><em style="background: #f2220c "><b></b></em></span><strong>default</strong></a>
				<ol>
					<li><a href="default/layout1.html">layout1</a></li>
					<li><a href="default/layout1-no-sidebar.html">layout1 no sidebar</a></li>
					<li><a href="default/layout1-right-sidebar.html">layout1 right sidebar</a></li>
					<li><a href="default/layout2.html">layout2</a></li>
					<li><a href="default/layout2-no-sidebar.html">layout2 no sidebar</a></li>
					<li><a href="default/layout2-right-sidebar.html">layout2 right sidebar</a></li>
					<li><a href="default/layout3.html">layout3</a></li>
					<li><a href="default/layout3-no-sidebar.html">layout3 no sidebar</a></li>
					<li><a href="default/layout3-right-sidebar.html">layout3 right sidebar</a></li>
					<li><a href="default/layout4.html">layout4</a></li>
					<li><a href="default/layout4-no-sidebar.html">layout4 no sidebar</a></li>
					<li><a href="default/layout4-right-sidebar.html">layout4 right sidebar</a></li>
				</ol>
			</li>
			<li>
				<a href="blue/layout1.html" class="color" style="color: #0091c7 "><span><em style="background: #0091c7 "><b></b></em></span><strong>blue</strong></a>
				<ol>
					<li><a href="blue/layout1.html">layout1</a></li>
					<li><a href="blue/layout1-no-sidebar.html">layout1 no sidebar</a></li>
					<li><a href="blue/layout1-right-sidebar.html">layout1 right sidebar</a></li>
					<li><a href="blue/layout2.html">layout2</a></li>
					<li><a href="blue/layout2-no-sidebar.html">layout2 no sidebar</a></li>
					<li><a href="blue/layout2-right-sidebar.html">layout2 right sidebar</a></li>
					<li><a href="blue/layout3.html">layout3</a></li>
					<li><a href="blue/layout3-no-sidebar.html">layout3 no sidebar</a></li>
					<li><a href="blue/layout3-right-sidebar.html">layout3 right sidebar</a></li>
					<li><a href="blue/layout4.html">layout4</a></li>
					<li><a href="blue/layout4-no-sidebar.html">layout4 no sidebar</a></li>
					<li><a href="blue/layout4-right-sidebar.html">layout4 right sidebar</a></li>
				</ol>
			</li>
			<li>
				<a href="green/layout1.html" class="color" style="color: #178c0a "><span><em style="background: #178c0a "><b></b></em></span><strong>green</strong></a>
				<ol>
					<li><a href="green/layout1.html">layout1</a></li>
					<li><a href="green/layout1-no-sidebar.html">layout1 no sidebar</a></li>
					<li><a href="green/layout1-right-sidebar.html">layout1 right sidebar</a></li>
					<li><a href="green/layout2.html">layout2</a></li>
					<li><a href="green/layout2-no-sidebar.html">layout2 no sidebar</a></li>
					<li><a href="green/layout2-right-sidebar.html">layout2 right sidebar</a></li>
					<li><a href="green/layout3.html">layout3</a></li>
					<li><a href="green/layout3-no-sidebar.html">layout3 no sidebar</a></li>
					<li><a href="green/layout3-right-sidebar.html">layout3 right sidebar</a></li>
					<li><a href="green/layout4.html">layout4</a></li>
					<li><a href="green/layout4-no-sidebar.html">layout4 no sidebar</a></li>
					<li><a href="green/layout4-right-sidebar.html">layout4 right sidebar</a></li>
				</ol>
			</li>
			<li>
				<a href="orange/layout1.html" class="color" style="color: #ff8400 "><span><em style="background: #ff8400 "><b></b></em></span><strong>orange</strong></a>
				<ol>
					<li><a href="orange/layout1.html">layout1</a></li>
					<li><a href="orange/layout1-no-sidebar.html">layout1 no sidebar</a></li>
					<li><a href="orange/layout1-right-sidebar.html">layout1 right sidebar</a></li>
					<li><a href="orange/layout2.html">layout2</a></li>
					<li><a href="orange/layout2-no-sidebar.html">layout2 no sidebar</a></li>
					<li><a href="orange/layout2-right-sidebar.html">layout2 right sidebar</a></li>
					<li><a href="orange/layout3.html">layout3</a></li>
					<li><a href="orange/layout3-no-sidebar.html">layout3 no sidebar</a></li>
					<li><a href="orange/layout3-right-sidebar.html">layout3 right sidebar</a></li>
					<li><a href="orange/layout4.html">layout4</a></li>
					<li><a href="orange/layout4-no-sidebar.html">layout4 no sidebar</a></li>
					<li><a href="orange/layout4-right-sidebar.html">layout4 right sidebar</a></li>
				</ol>
			</li>
			<li>
				<a href="pink/layout1.html" class="color" style="color: #de2477 "><span><em style="background: #de2477 "><b></b></em></span><strong>pink</strong></a>
				<ol>
					<li><a href="pink/layout1.html">layout1</a></li>
					<li><a href="pink/layout1-no-sidebar.html">layout1 no sidebar</a></li>
					<li><a href="pink/layout1-right-sidebar.html">layout1 right sidebar</a></li>
					<li><a href="pink/layout2.html">layout2</a></li>
					<li><a href="pink/layout2-no-sidebar.html">layout2 no sidebar</a></li>
					<li><a href="pink/layout2-right-sidebar.html">layout2 right sidebar</a></li>
					<li><a href="pink/layout3.html">layout3</a></li>
					<li><a href="pink/layout3-no-sidebar.html">layout3 no sidebar</a></li>
					<li><a href="pink/layout3-right-sidebar.html">layout3 right sidebar</a></li>
					<li><a href="pink/layout4.html">layout4</a></li>
					<li><a href="pink/layout4-no-sidebar.html">layout4 no sidebar</a></li>
					<li><a href="pink/layout4-right-sidebar.html">layout4 right sidebar</a></li>
				</ol>
			</li>
			<li>
				<a href="dark/layout1.html" class="color" style="color: #000000 "><span><em style="background: #000000 "><b></b></em></span><strong>dark</strong></a>
				<ol>
					<li><a href="dark/layout1.html">layout1</a></li>
					<li><a href="dark/layout1-no-sidebar.html">layout1 no sidebar</a></li>
					<li><a href="dark/layout1-right-sidebar.html">layout1 right sidebar</a></li>
					<li><a href="dark/layout2.html">layout2</a></li>
					<li><a href="dark/layout2-no-sidebar.html">layout2 no sidebar</a></li>
					<li><a href="dark/layout2-right-sidebar.html">layout2 right sidebar</a></li>
					<li><a href="dark/layout3.html">layout3</a></li>
					<li><a href="dark/layout3-no-sidebar.html">layout3 no sidebar</a></li>
					<li><a href="dark/layout3-right-sidebar.html">layout3 right sidebar</a></li>
					<li><a href="dark/layout4.html">layout4</a></li>
					<li><a href="dark/layout4-no-sidebar.html">layout4 no sidebar</a></li>
					<li><a href="dark/layout4-right-sidebar.html">layout4 right sidebar</a></li>
				</ol>
			</li>
			<li>
				<a href="dark-blue/layout1.html" class="color" style="color: #12578c "><span><em style="background: #12578c "><b></b></em></span><strong>dark blue</strong></a>
				<ol>
					<li><a href="dark-blue/layout1.html">layout1</a></li>
					<li><a href="dark-blue/layout1-no-sidebar.html">layout1 no sidebar</a></li>
					<li><a href="dark-blue/layout1-right-sidebar.html">layout1 right sidebar</a></li>
					<li><a href="dark-blue/layout2.html">layout2</a></li>
					<li><a href="dark-blue/layout2-no-sidebar.html">layout2 no sidebar</a></li>
					<li><a href="dark-blue/layout2-right-sidebar.html">layout2 right sidebar</a></li>
					<li><a href="dark-blue/layout3.html">layout3</a></li>
					<li><a href="dark-blue/layout3-no-sidebar.html">layout3 no sidebar</a></li>
					<li><a href="dark-blue/layout3-right-sidebar.html">layout3 right sidebar</a></li>
					<li><a href="dark-blue/layout4.html">layout4</a></li>
					<li><a href="dark-blue/layout4-no-sidebar.html">layout4 no sidebar</a></li>
					<li><a href="dark-blue/layout4-right-sidebar.html">layout4 right sidebar</a></li>
				</ol>
			</li>
			<li>
				<a href="dark-brown/layout1.html" class="color" style="color: #6c3f30 "><span><em style="background: #6c3f30 "><b></b></em></span><strong>dark brown</strong></a>
				<ol>
					<li><a href="dark-brown/layout1.html">layout1</a></li>
					<li><a href="dark-brown/layout1-no-sidebar.html">layout1 no sidebar</a></li>
					<li><a href="dark-brown/layout1-right-sidebar.html">layout1 right sidebar</a></li>
					<li><a href="dark-brown/layout2.html">layout2</a></li>
					<li><a href="dark-brown/layout2-no-sidebar.html">layout2 no sidebar</a></li>
					<li><a href="dark-brown/layout2-right-sidebar.html">layout2 right sidebar</a></li>
					<li><a href="dark-brown/layout3.html">layout3</a></li>
					<li><a href="dark-brown/layout3-no-sidebar.html">layout3 no sidebar</a></li>
					<li><a href="dark-brown/layout3-right-sidebar.html">layout3 right sidebar</a></li>
					<li><a href="dark-brown/layout4.html">layout4</a></li>
					<li><a href="dark-brown/layout4-no-sidebar.html">layout4 no sidebar</a></li>
					<li><a href="dark-brown/layout4-right-sidebar.html">layout4 right sidebar</a></li>
				</ol>
			</li>
			<li>
				<a href="dark-green/layout1.html" class="color" style="color: #3c4e1a "><span><em style="background: #3c4e1a "><b></b></em></span><strong>dark green</strong></a>
				<ol>
					<li><a href="dark-green/layout1.html">layout1</a></li>
					<li><a href="dark-green/layout1-no-sidebar.html">layout1 no sidebar</a></li>
					<li><a href="dark-green/layout1-right-sidebar.html">layout1 right sidebar</a></li>
					<li><a href="dark-green/layout2.html">layout2</a></li>
					<li><a href="dark-green/layout2-no-sidebar.html">layout2 no sidebar</a></li>
					<li><a href="dark-green/layout2-right-sidebar.html">layout2 right sidebar</a></li>
					<li><a href="dark-green/layout3.html">layout3</a></li>
					<li><a href="dark-green/layout3-no-sidebar.html">layout3 no sidebar</a></li>
					<li><a href="dark-green/layout3-right-sidebar.html">layout3 right sidebar</a></li>
					<li><a href="dark-green/layout4.html">layout4</a></li>
					<li><a href="dark-green/layout4-no-sidebar.html">layout4 no sidebar</a></li>
					<li><a href="dark-green/layout4-right-sidebar.html">layout4 right sidebar</a></li>
				</ol>
			</li>
			<li>
				<a href="dark-red/layout1.html" class="color" style="color: #ab1817 "><span><em style="background: #ab1817 "><b></b></em></span><strong>dark red</strong></a>
				<ol>
					<li><a href="dark-red/layout1.html">layout1</a></li>
					<li><a href="dark-red/layout1-no-sidebar.html">layout1 no sidebar</a></li>
					<li><a href="dark-red/layout1-right-sidebar.html">layout1 right sidebar</a></li>
					<li><a href="dark-red/layout2.html">layout2</a></li>
					<li><a href="dark-red/layout2-no-sidebar.html">layout2 no sidebar</a></li>
					<li><a href="dark-red/layout2-right-sidebar.html">layout2 right sidebar</a></li>
					<li><a href="dark-red/layout3.html">layout3</a></li>
					<li><a href="dark-red/layout3-no-sidebar.html">layout3 no sidebar</a></li>
					<li><a href="dark-red/layout3-right-sidebar.html">layout3 right sidebar</a></li>
					<li><a href="dark-red/layout4.html">layout4</a></li>
					<li><a href="dark-red/layout4-no-sidebar.html">layout4 no sidebar</a></li>
					<li><a href="dark-red/layout4-right-sidebar.html">layout4 right sidebar</a></li>
				</ol>
			</li>
		</ul>
		<div class="cl">&nbsp;</div>
	</div>
	<div class="mc-logos"><img src="mc_cm_logos.gif" width="168" height="42" alt="0" /></div>
</div>
<iframe id="frame" src="" width="100%" scrolling="auto" frameborder="0"></iframe>
</body>
</html>